'use client';
import { CDN } from "@/utils/env";
import type { CSSProperties } from "react";
import Menu from "../components/Menu";
import MSwiper from "./components/Swiper";
import Content from "./components/Content";
import Review from "./components/Review";
import { useAppSelector } from "@/store/hooks";

export default function Home() {
    const { open } = useAppSelector(state => state.home)
    return <main
        style={{ "--bg": `url('${CDN}images/bg.png')` } as CSSProperties}
        className="w-screen h-screen overflow-auto bg-no-repeat bg-cover bg-(image:--bg) font-[Roboto] bg-center"
    >
        <Menu />
        {open && <Review />}
        <div className="lg:flex lg:flex-row-reverse items-center justify-center h-[calc(100vh-64px)]">
            <MSwiper />
            <Content />
        </div>
    </main>
}